<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>接口测试页面</title>
</head>

<body>
    <button onclick="handler()">点我开始发送请求</button>
    <script>
        // const btn = document.querySelector('button');
        let comxhr = null;
        function handler() {
            if (comxhr) {
                console.log("取消了请求");
                comxhr.abort();
                comxhr = null;
            }
            console.log('开始发送请求');
            const xhr = new XMLHttpRequest();
            xhr.open('GET', 'http://localhost:3000/test', true);
            xhr.send();
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4 && xhr.status === 200) {
                    console.log(xhr.responseText);
                }
                comxhr = null
            }
            comxhr = xhr;
        }
    </script>
</body>

</html>